<template>
  <div v-if="details.length && windowWidth > 992">
    <img
      :src="isHttp(details[0].imgUrl)"
      alt=""
      class="w-100"
      style="height: 450px"
    />
    <div id="crumbs" class="max-1200">
      <img src="@/assets/icon/weizhi.png" alt="" class="ic" />
      <a href="/">{{globalLanguage.languageSuffix == "Cn" ? "首页" : "Главная страница"}}</a>&gt;
      <a>{{globalLanguage.languageSuffix === "Cn" ? "公司业务" : "Операции"}}</a>&gt;
      <a>{{globalLanguage.languageSuffix === "Cn" ? "双清含税专线" : "Двойная налоговая линия"}}</a>&gt;
      <router-link to="/business/shuangqing/air"> {{globalLanguage.languageSuffix === "Cn" ? "双清空运" : "Двойной воздушный транспорт"}}</router-link>
    </div>

    <h2 class="title1">
<!--      {{ details[0]["title" + globalLanguage.languageSuffix] }}-->
      <el-input v-model="details[0]['title' + globalLanguage.languageSuffix]" size="large" style="width: 200px"></el-input>
    </h2>
    <p><br /></p>
    <div style="margin-bottom: 50px;text-align: center;">
      <div v-for="(item, index) in details" :key="index">
<!--        <div class="max-1200" style="line-height: 100px">-->
<!--          <p v-html="item['desc' + globalLanguage.languageSuffix]"></p>-->
<!--        </div>-->
        <el-input v-model="item['desc' + globalLanguage.languageSuffix]" type="textarea" size="large"  :rows="10"></el-input>
      </div>
      <!--        修改完所有输入框点击此按钮进行修改-->
      <el-button type="success" @click="changeAllText" style="margin: 10px 0;" >更改后点击此按钮进行修改</el-button>
    </div>
  </div>
  <div class="container2" v-else-if="details.length && windowWidth <= 992">
    <img :src="isHttp(details[0].imgUrl)" alt="业务图片" class="w-100"/>
    <el-breadcrumb separator="/" style="padding-right: 20px;padding-left: 20px;">
      <el-breadcrumb-item :to="{ path: '/admin' }">{{globalLanguage.languageSuffix === 'Cn'? '首页' : 'главная'}}</el-breadcrumb-item>
      <el-breadcrumb-item>
        {{ details[0]['title' + globalLanguage.languageSuffix]}}
      </el-breadcrumb-item>
    </el-breadcrumb>
    <div class="content" style="line-height: 46px; background:url(	https://esudagz.com/template/web/default/skin/img/image/about_case.jpg)">
      <div class="zhuanxian-content" style="padding: 0 1.875rem 5rem ">
        <p>
          <strong style="left: 0; white-space: pre-wrap;line-height: 1.5 !important;">{{ details[0]['desc'+globalLanguage.languageSuffix] }}</strong>
        </p>
      </div>
    </div>
  </div>
</template>

<script setup>
import { detailsText , updateAlltext } from "@/api/alltext.js";
import {onMounted, onUnmounted, ref} from "vue";
import {ElMessage} from "element-plus";
import {isHttp} from "@/utils/index.js";

const list = ref([]);
const windowWidth = ref(window.innerWidth);
const details = ref([]);
const getText = async () => {
  try {
    const response = await detailsText(2);
    details.value = response.list;
  } catch (error) {
    console.error("获取数据失败:", error);
  }
};
getText();
const changeAllText = async () => {
  try {
    const response = await updateAlltext(details.value);
   if (response.code === 200) {
     ElMessage({
       message: '信息更新成功',
       grouping: true,
       type: 'success',
     })
   }
  } catch (error) {
    console.error("修改失败:", error);
  }
};

const handleResize = () => {
  windowWidth.value = window.innerWidth;
  if (windowWidth.value <= 992) {
    getCompanyBusiness(); // 重新加载数据
  }
};
onMounted(() => {
  window.addEventListener('resize', handleResize);
});
// 监听屏幕大小变化
onUnmounted(() => {
  window.removeEventListener('resize', handleResize);
});
</script>

<style scoped>
.zhuanxian-content p {
  text-align: left;
  font-size: 14px;
  line-height: 2;
}
.container2{
  margin-top: -70px;
  height: auto;
}
</style>
